﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="webBootStrap._Default" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head runat="server">
    <title>Empezando con BootStrap</title>
    <link href="assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
    <link rel="shortcut icon" href="assets/ico/favicon.ico" />
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png" />
</head>
<body>
    <form id="form1" runat="server">
    <!--Cabecera-->
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="navbar-inner">
            <div class="container-fluid">
                <a class="btn btn-navbar collapsed" data-toggle="collapse" data-target=".nav-collapse">
                    <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
                    </span></a><a class="brand" href="#">¡¡¡Twitter BootStrap!!!</a>
                <div class="nav-collapse collapse">
                    <p class="navbar-text pull-right">
                        Conectado como <a href="#" class="navbar-link">Usuario</a>
                    </p>
                    <ul class="nav">
                        <li class="active"><a href="#">Inicio</a> </li>
                        <li><a href="#">Acerca de</a> </li>
                        <li><a href="#">Contáctenos</a> </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    
    <!--Cuerpo-->
    <div class="container-fluid">
        <div class="container-fluid">
            <div class="row-fluid">
                <!--Menú Lateral-->
                <div class="span3">
                    <div class="well sidebar-nav">
                        <ul class="nav nav-list">
                            <li class="nav-header">Menu Lateral 1</li>
                            <li class="active"><a href="#">Enlace 1.1</a></li>
                            <li><a href="#">Enlace 1.2</a></li>
                            <li><a href="#">Enlace 1.3</a></li>
                            <li><a href="#">Enlace 1.4</a></li>
                            <li class="nav-header">Menu Lateral 2</li>
                            <li><a href="#">Enlace 2.1</a></li>
                            <li><a href="#">Enlace 2.2</a></li>
                            <li><a href="#">Enlace 2.3</a></li>
                            <li class="nav-header">Menu Lateral 3</li>
                            <li><a href="#">Enlace 3.1</a></li>
                            <li><a href="#">Enlace 3.2</a></li>
                        </ul>
                    </div>
                </div>
                <!--Cuerpo-->
                <div class="span9">
                    <div class="hero-unit">
                        <h1>
                            Probando Twitter BootStrap!</h1>
                        <p>
                            "Esta es una plantilla de prueba utilizando Twitter BootStrap. Incluye un título
                            llamativo y 3 unidades para contenido."
                        </p>
                        <p>
                            <a class="btn btn-primary btn-large">Aprenda más >></a>
                        </p>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <h2>
                                SubTítulo 1</h2>
                            <p>
                                Texto de referencia de subtítulo 1</p>
                            <a class="btn" href="#">Más detalles >></a>
                        </div>
                        <div class="span4">
                            <h2>
                                SubTítulo 2</h2>
                            <p>
                                Texto de referencia de subtítulo 2</p>
                            <a class="btn" href="#">Más detalles >></a>
                        </div>
                        <div class="span4">
                            <h2>
                                SubTítulo 3</h2>
                            <p>
                                Texto de referencia de subtítulo 3</p>
                            <a class="btn" href="#">Más detalles >></a>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <h2>
                                SubTítulo 1</h2>
                            <p>
                                Texto de referencia de subtítulo 1</p>
                            <a class="btn" href="#">Más detalles >></a>
                        </div>
                        <div class="span4">
                            <h2>
                                SubTítulo 2</h2>
                            <p>
                                Texto de referencia de subtítulo 2</p>
                            <a class="btn" href="#">Más detalles >></a>
                        </div>
                        <div class="span4">
                            <h2>
                                SubTítulo 3</h2>
                            <p>
                                Texto de referencia de subtítulo 3</p>
                            <a class="btn" href="#">Más detalles >></a>
                        </div>
                    </div>
                </div>
                <hr />
                <footer>
                    <p>Omar Alvarez - 2012</p>
                    <div class="control-group">
                        <label class="control-label" for="txtMail">Correo Electrónico</label>
                        <div class="controls">
                            <div class="input-prepend">
                                <span class="add-on"><i class="icon-envelope"></i></span>
                                
                                <asp:TextBox CssClass="span2" ID="txtMail" runat=server></asp:TextBox>
                            </div>
                        </div>
                    </div>
                </footer>
            </div>
        </div>
    </div>
    <scrit src="assets/js/application.js" type="text/javascript"></script>
    <script src="assets/js/jquery.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-affix.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-alert.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-button.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-carousel.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-collapse.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-dropdown.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-modal.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-popover.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-scrollspy.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-tab.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-tooltip.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-transition.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap-typeahead.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap.js" type="text/javascript"></script>
    <script src="assets/js/bootstrap.min.js" type="text/javascript"></script>
    </form>
</body>
</html>
